<template>
    <el-card class="box-card" :style="{'line-height':enableSwap?'':'25px'}">
        <div slot="header" class="clearfix">
            <span>磁盘信息</span>
        </div>
        <div v-for="diskItem in disks.diskinfo">
            <el-row :style="{'margin-top':enableSwap?'15px':'20px'}">{{diskItem.mounted +" "+ diskItem.total}}</el-row>
            <el-progress style="margin-top:2px;" v-if="diskItem.capacity<85" :text-inside="true" status="success" :show-text="true" :stroke-width="15" :percentage="diskItem.capacity" />
            <el-progress style="margin-top:2px;" v-else  :show-text="true" :text-inside="true" status="warning" :stroke-width="15" :percentage="diskItem.capacity" />

        </div>
    </el-card>
</template>

<script>
    import { ipcRenderer } from "electron";
    export default {
        created() {
            this.getDiskInfo();
        },
        data() {
            return {
                disks: [],
                enableSwap: false
            }
        },
        methods: {
            getDiskInfo() {
                ipcRenderer.invoke("getDiskinfo").then(res => {
                    res.diskinfo.forEach((v,i)=>{
                        v.capacity =  Number(v.capacity.replace("%",""))
                    })
                    console.log(res)
                    this.disks = res;
                });
            }
        }
    }
</script>
